﻿<!-- A small toolbar button (Message Box) -->
<div class="toolbar_small">
	<div class="toolbutton">
		<span>8</span> <!-- Number of unread messages -->
		<img src="@Url.Content("~/Content/Peach/img/icons/16x16/mail.png")" width="16" height="16" alt="mail" />
	</div>
    <!-- Contains the unread messages in a list (Maybe only show top 5) -->
	<div class="toolbox">
		<span class="arrow"></span>
		<h3>Your Messages</h3>
		<ul class="mail">
			<li>
				<a href="#"> <strong>10:15</strong>Need your Help!
				<small>
					From: John
				</small> </a>

			</li>
			<li>
				<a href="#"> <strong>9:55</strong>New comment on you theme
				<small>
					From: themeforest
				</small></a>
			</li>
			<li>
				<a href="#"> <strong>Yest.</strong>Successful backup
				<small>

					From: System
				</small></a>
			</li>
			<li class="read">
				<a href="#"> <strong>2 days</strong>Bug report
				<small>
					From: Jane
				</small></a>
			</li>

		</ul>
		<a class="inbox" href="#">Go to inbox &raquo;</a> <!-- ALink to inbox page -->
	</div>
</div> <!-- End of small toolbar button -->